<template>
  <FlowDetail
    v-model:visible="flowDetailVisible"
    @success="handleSuccess"
    ref="flowDetail"
    @change="change"
  />
</template>

<script setup lang="ts">
  import FlowDetail from '/@/components/FlowTable/src/components/FlowDetail.vue';
  import { ref, onMounted, watch } from 'vue';
  const flowDetailVisible = ref(false);
  const flowDetail = ref<any>(null);
  const handleSuccess = (val) => {
    console.log(val);
  };

  const emit = defineEmits(['change']);

  const props = defineProps({
    closeModal: {
      type: Function,
      default: () => {},
    },

    setModalProps: {
      type: Function,
      default: () => {},
    },
    record: {
      type: Object,
    },
    allData: {
      type: Object,
    },
  });
  const change = (data) => {
    emit('change', data);
  };
  function openFlowListSuccess(id) {
    flowDetailVisible.value = true;

    if (flowDetail.value) {
      console.log('btnItemTemp', props.allData);

      props.record!.templateId = id;
      flowDetail.value?.openPage(true, { ...props.allData?.btnItem, isCheck: true });
    }
  }
  watch(
    () => flowDetailVisible,
    (v) => {
      console.log(`flowDetailVisible----------`, v);
    },
  );
  onMounted(() => {
    openFlowListSuccess(null);
  });
</script>

<style lang="less" scoped></style>
